<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page import="com.BMS.entity.Book.*"%>
<%@ page import="com.alibaba.fastjson.JSON"%>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>图书管理系统</title>

<link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css">

<script src="../js/jquery-1.11.2.min.js" type="text/javascript"></script>
<script src="../js/bootstrap.js" type="text/javascript"></script>
<script src="../js/json2.js" type="text/javascript"></script>

<!-- 使按键失效，用于权限控制  -->
<style type="text/css">
.disable {
	style ="pointer-events: none";
}
</style>

<!-- 导航栏图书检索 -->
<script type="text/javascript">
	function toSearch() {
		window.location.href = "./BookSearch.jsp?book_id=" + document.getElementById("book_id").value;
	}
</script>

<!-- 查询图书 -->
<script type="text/javascript">
	function search() {
		var input_id = document.getElementById("input_id").value;
		if(input_id.length==0) {
			alert("图书ID不能为空！");	
		} else if(!(input_id.match("[0-9]+"))) {
			alert("图书ID只能为纯数字！");	
		} else {
			$.ajax({
				type:"GET",
				url:"./bookSearch.do?book_id="+input_id,
				dataType:"json",
				success:function(data){
					if(data.code=="200"){
						var book = JSON.parse(data.book);
						//alert(json.type);
						var pic_path = "../img/book" + book.book_ID;
						pic_path += ".png";
						document.getElementById("book_pic").setAttribute("src", pic_path);
						document.getElementById("book_ID").innerHTML = book.book_ID;
						document.getElementById("title").innerHTML = book.title;
						document.getElementById("author").innerHTML = book.author;
						document.getElementById("publisher").innerHTML = book.publisher;
						document.getElementById("publish_date").innerHTML = book.publish_date;
						document.getElementById("price").innerHTML = book.price;
						if(data.status) {
							// 可借阅
							document.getElementById("status").innerHTML = "可借阅";
							document.getElementById("reader_id").innerHTML = "无";
							document.getElementById("borrow_date").innerHTML = "无";
						} else {
							// 已借出
							document.getElementById("status").innerHTML = "已借出";
							document.getElementById("reader_id").innerHTML = data.reader_id;
							document.getElementById("borrow_date").innerHTML = data.borrow_date;
						}
					}else if(data.code=="400"){
						alert(data.msg);
					}else {
						alert("未知错误！");
					}
				},
				error:function(){
					alert("获取失败！");
				}
			});	
		}
	}
</script>

</head>

<body>

	<!-- 大背景 -->
	<div class="container" align="center"
		style=" width:auto; height:768px; background-color:#BFEDEA; background-image:url(../img/bg2.png); -moz-background-size:100% 100%; background-size:100% 100%;">

		<!-- 导航栏 -->
		<div style="width:100%; height:auto;">
			<nav class="navbar navbar-default">
				<div class="container-fluid">
					<!-- Brand and toggle get grouped for better mobile display -->
					<div class="navbar-header">

						<a class="navbar-brand" href="../main.jsp">首页</a>
					</div>
					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse" id="defaultNavbar1">
						<ul class="nav navbar-nav">
							<!-- 图书管理下拉框 -->
							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown" role="button" aria-expanded="false">图书管理<span
									class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a id="bookManage" href="./BookManage.jsp">管理图书</a></li>
									<li><a id="bookSearch" href="./BookSearch.jsp">图书查询</a></li>
									<li><a id="bookBorrow" href="./BookBorrow.jsp">图书借阅</a></li>
									<li><a id="bookReturn" href="./BookReturn.jsp">图书归还</a></li>
								</ul></li>

							<!-- 违规管理下拉框 -->
							<li class="dropdown" id="violation_manage"><a href="#"
								class="dropdown-toggle" data-toggle="dropdown" role="button"
								aria-expanded="false">违规管理<span class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="../Violation/ViolationManage.jsp">管理违规记录</a></li>
									<li><a href="../Violation/ViolationReg.jsp">违规登记</a></li>
								</ul></li>

							<!-- 个人中心下拉框 -->
							<li class="dropdown"><a href="#" class="dropdown-toggle"
								data-toggle="dropdown" role="button" aria-expanded="false">个人中心<span
									class="caret"></span></a>
								<ul class="dropdown-menu" role="menu">
									<li><a href="../User/PersonalImfo.jsp">个人资料</a></li>
									<li id="bookHistory"><a href="../User/BookHistory.jsp">借阅记录</a></li>
									<li id="violationHistory"><a
										href="../User/ViolationHistory.jsp">违规记录</a></li>
									<li><a href="../User/Logout.do">退出登录</a></li>
								</ul></li>
						</ul>
						<!-- 搜索栏 -->
						<div style="float:right;">
							<form class="navbar-form navbar-left" role="search">
								<div class="form-group">
									<input type="text" id="book_id" class="form-control"
										placeholder="输入图书编号">
								</div>
								<button type="button" class="btn btn-default"
									onclick="toSearch()">查询</button>
							</form>
						</div>

					</div>
					<!-- /.navbar-collapse -->
				</div>
				<!-- /.container-fluid -->
			</nav>
		</div>

		<!-- 工作区 -->
		<div class="container" align="center"
			style="width:80%; height:85%; background-color:rgba(255, 255, 255, 0.5);">
			<div align="center" style="text-align:center;">
				<label style="margin:15px 0 0 0; font-family:华文行楷; font-size:35px;">图书查询<br>
				</label>
				<hr>
			</div>

			<div style="font-size:18px;">
				<label>输入图书ID：</label> <input type="text" id="input_id" />
				<button type="button" id="show_info" onclick="search()">显示图书信息</button>
			</div>
			<div style="margin-top:5px; font-size:18px;">
				<table>
					<tr>
						<td colspan="2"><img id="book_pic" src="" alt="图书照片" style="width:100%; height:25%;"/></td>
					</tr>
					<tr>
						<td><label>图书ID：</label></td>
						<td><label id="book_ID"></label></td>
					</tr>
					<tr>
						<td><label>书名：</label></td>
						<td><label id="title"></label></td>
					</tr>
					<tr>
						<td><label>作者：</label></td>
						<td><label id="author"></label></td>
					</tr>
					<tr>
						<td><label>出版社：</label></td>
						<td><label id="publisher"></label></td>
					</tr>
					<tr>
						<td><label>出版日期：</label></td>
						<td><label id="publish_date"></label></td>
					</tr>
					<tr>
						<td><label>价格：</label></td>
						<td><label id="price"></label></td>
					</tr>
					<tr>
						<td><label>状态：</label></td>
						<td><label id="status"></label></td>
					</tr>
					<tr>
						<td><label>借阅读者：</label></td>
						<td><label id="reader_id"></label></td>
					</tr>
					<tr>
						<td><label>借出时间：</label></td>
						<td><label id="borrow_date"></label></td>
					</tr>
				</table>
			</div>
		</div>
	</div>
</body>
<!-- 权限控制 -->
<script type="text/javascript">
 	var user_type = "<%=session.getAttribute("user_type")%>";
 	if(user_type!=null) {
 		if(user_type=="reader") {
			document.getElementById("bookManage").style['pointer-events'] = 'none';
			document.getElementById("bookBorrow").style['pointer-events'] = 'none';
			document.getElementById("bookReturn").style['pointer-events'] = 'none';
 		} else {
 			document.getElementById("bookHistory").style['pointer-events'] = 'none';
 			document.getElementById("violationHistory").style['pointer-events'] = 'none';
 		}
 	}
</script>

<!-- 判断是否由导航栏检索框传入参数 -->
<script type="text/javascript">
	window.onload = function() {
		<%if(request.getParameter("book_id")!=null) {%>
			document.getElementById("input_id").value = <%=request.getParameter("book_id")%>;
			search();
		<%}%>
	}
</script>
</html>
